<template>
  <view class="container">
    <view class="header-card">
      <view class="title">需求收集</view>
      <view class="subtitle">欢迎提交您的民生诉求与建议</view>
    </view>

    <view class="info-card">
      <view class="section-title">提交方式</view>
      <view class="info-row">
        <text class="label">线上填报：</text>
        <text class="value">即将上线的专用表单</text>
      </view>
      <view class="info-row">
        <text class="label">电话：</text>
        <text class="value">400-1234-567</text>
      </view>
      <view class="info-row">
        <text class="label">邮箱：</text>
        <text class="value">needs@village.local</text>
      </view>
    </view>

    <view class="placeholder-card">
      <text class="placeholder-title">功能建设中</text>
      <text class="placeholder-desc">
        需求收集将在近期开放线上填报入口，您也可以通过电话或邮箱与我们联系。
      </text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {}
  }
}
</script>

<style scoped>
.container {
  padding: 24rpx;
  background-color: #f5f5f5;
  min-height: 100vh;
  box-sizing: border-box;
}

.header-card {
  background: linear-gradient(135deg, #4caf50, #45a049);
  border-radius: 20rpx;
  padding: 40rpx 30rpx;
  color: #fff;
  margin-bottom: 30rpx;
  box-shadow: 0 15rpx 30rpx rgba(76, 175, 80, 0.25);
}

.title {
  font-size: 40rpx;
  font-weight: bold;
}

.subtitle {
  margin-top: 10rpx;
  font-size: 28rpx;
  opacity: 0.9;
}

.info-card,
.placeholder-card {
  background-color: #fff;
  border-radius: 20rpx;
  padding: 30rpx;
  box-shadow: 0 10rpx 24rpx rgba(0, 0, 0, 0.05);
  margin-bottom: 24rpx;
}

.section-title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 20rpx;
}

.info-row {
  display: flex;
  margin-bottom: 16rpx;
}

.info-row:last-child {
  margin-bottom: 0;
}

.label {
  width: 180rpx;
  color: #666;
  font-size: 28rpx;
}

.value {
  flex: 1;
  color: #333;
  font-size: 28rpx;
}

.placeholder-title {
  font-size: 34rpx;
  font-weight: bold;
  color: #333;
}

.placeholder-desc {
  margin-top: 12rpx;
  color: #666;
  font-size: 28rpx;
  line-height: 1.6;
}
</style>

